<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>服装</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no" />
		<link rel="stylesheet" type="text/css" href="css/conmon/conmon.css"/>
	</head>
	<body>
		<div class="web">
			<!--头部-->
			<header>
				<div class="header_left">
					<!--隐藏菜单-->
					<div class="menu-wrap">

						<!--隐藏菜单内容-->
						<div class="cai_dan_main">
							<div class="header_left">
								<a href="" class="search-icon"><img src="img/img1/icon-search.png" /></a>
							</div>
							<div class="logo">
								<a href="index.html"><img src="img/img1/icon-logo.png" /></a>
							</div>
							
							
							<!--菜单-->
							<div class="leftsidebar_box">
								<!--<div class="line"></div>-->
								<dl class="system_log">
									<dt onClick="changeImage()">上新<img src="img/img1/select_xl01.png"></dt>
									<dd class="first_dd">
										<a href="#">你猜</a>
									</dd>
									<dd>
										<a href="#">你猜</a>
									</dd>
								</dl>

								<dl class="custom">
									<dt>服装<img src="img/img1/select_xl01.png"></dt>
									<dd class="first_dd">
										<a href="#">你猜</a>
									</dd>
									<dd>
										<a href="#">你猜</a>
									</dd>
								</dl>
								
								<dl class="channel">
									<dt onClick="changeImage()">鞋履<img src="img/img1/select_xl01.png"></dt>
									<dd class="first_dd">
										<a href="#">靴</a>
									</dd>
									<dd>
										<a href="editorial.html">休闲鞋</a>
									</dd>
									<dd>
										<a href="editorial.html">运动鞋</a>
									</dd>
									<dd>
										<a href="#">凉鞋</a>
									</dd>
								</dl>

								<dl class="app">
									<dt onClick="changeImage()">配件<img src="img/img1/select_xl01.png"></dt>
									<dd class="first_dd">
										<a href="#">你猜</a>
									</dd>
									<dd>
										<a href="#">你猜</a>
									</dd>
								</dl>
								
								<dl class="app">
									<dt onClick="changeImage()" class="disable">销售<img src="img/img1/select_xl01.png"></dt>
									<dd class="first_dd">
										<a href="#">你猜</a>
									</dd>
									<dd>
										<a href="#">你猜</a>
									</dd>
								</dl>
								
								<dl class="app">
									<dt onClick="changeImage()">品牌A-Z<img src="img/img1/select_xl01.png"></dt>
									<dd class="first_dd">
										<a href="#">你猜</a>
									</dd>
									<dd>
										<a href="#">你猜</a>
									</dd>
								</dl>
							</div>

							<div class="cai_dan_bottom">
								<ul>
									<li>
										<a href=""><img src="img/img1/icon-10-xin.png" /></a>
									</li>
									<li>
										<a href=""><img src="img/img1/icon-1.png" /></a>
									</li>
									<li>
										<a href=""><img src="img/img1/icon-11.png" /></a>
									</li>
								</ul>
							</div>
						</div>

						<button class="close-button" id="close-button">Close Menu</button>

						<div class="morph-shape" id="morph-shape" data-morph-open="M-7.312,0H15c0,0,66,113.339,66,399.5C81,664.006,15,800,15,800H-7.312V0z;M-7.312,0H100c0,0,0,113.839,0,400c0,264.506,0,400,0,400H-7.312V0z">
							<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 100 800" preserveAspectRatio="none">
								<path d="M-7.312,0H0c0,0,0,113.839,0,400c0,264.506,0,400,0,400h-7.312V0z" />
							</svg>
						</div>
					</div>
					<button class="menu-button" id="open-button">Open Menu</button>
					<!--隐藏菜单-->
				</div>
					
				<div class="header_right">
					<a href=""><img src="img/img1/icon-1.png"/></a>
				</div>
				
				<h5>服装</h5>
			</header>
			
			<!--主体-->
			<section>
				<div class="cloth_class">
					<div class="class_left fl">
						类别
					</div>
					<div class="class_right fl">
						
					</div>
				</div>
				<div class="cloth_class cloth_type">
					<a href="JW.html">开拓者</a>
				</div>
				<div class="cloth_class cloth_type">
					<a href="cloth-main.html">平角裤</a>
				</div>
				<div class="cloth_class cloth_type">
					<a href="">斜纹棉布裤</a>
				</div>
				<div class="cloth_class cloth_type">
					<a href="">Gilets</a>
				</div>
				<div class="cloth_class cloth_type">
					<a href="" class="te_bie">外套</a>
				</div>
				<div class="cloth_class cloth_type">
					<a href="">牛仔裤</a>
				</div>
				<div class="cloth_class cloth_type">
					<a href="">针织背心</a>
				</div>
				<div class="cloth_class cloth_type">
					<a href="" class="te_bie">针织衫</a>
				</div>
				<div class="cloth_class cloth_type">
					<a href="">长袖球衫</a>
				</div>
				<div class="cloth_class cloth_type">
					<a href="">Polo衫</a>
				</div>
				<div class="cloth_class cloth_type">
					<a href="">短袖衬衫</a>
				</div>
			</section>
			
		</div>
	</body>
	<script>document.body.style.height  = window.innerHeight+"px";</script>
	
	<script type="text/javascript">
		/*动态改变根元素字体大小*/
			function recalc() {
				var clientWidth = document.documentElement.clientWidth;
				if(!clientWidth) return;
				document.documentElement.style.fontSize = 40 * (clientWidth / 750) + 'px';
				//字体大小=1个rem单位表示多少个像素*(设备的宽度/设计宽度)
			}

			function initRecalc() {
				recalc();
				var resizeEvt = 'osrientationchange' in window ? 'orientationchange' : 'resize';
				if(!document.addEventListener) return;
				window.addEventListener(resizeEvt, recalc, false);
				document.addEventListener('DOMContentLoaded', recalc, false);
			}
			initRecalc();

	</script>
	<!--隐藏菜单侧栏-->
	<script src="js/yjr/snap.svg-min.js"></script>
	<script src="js/yjr/main4.js"></script>
	<script src="js/yjr/classie.js"></script>
	
	<!--隐藏左侧菜单-->
	<script src="http://www.jq22.com/jquery/1.11.1/jquery.min.js"></script>
	<script type="text/javascript">
		$(".leftsidebar_box dt").css({
			"background-color": "#171616"
		});
		$(".leftsidebar_box dt img").attr("src", "img/img1/select_xl01.png");
		$(function() {
			$(".leftsidebar_box dd").hide();
			$(".leftsidebar_box dt").click(function() {
				$(".leftsidebar_box dt").css({
					"background-color": "#171616"
				})
				$(this).css({
					"background-color": "1e1d1d"
				});
				$(this).parent().find('dd').removeClass("menu_chioce");
				$(".leftsidebar_box dt img").attr("src", "img/img1/select_xl01.png");
				$(this).parent().find('img').attr("src", "img/img1/select_xl.png");
				$(".menu_chioce").slideUp();
				$(this).parent().find('dd').slideToggle();
				$(this).parent().find('dd').addClass("menu_chioce");
			});
		})
	</script>
</html>
